$(function () {
  function updateData () {
    $.ajax({
      url: BigNew.category_list,
      success: function (backData) {
        if (backData.code == 200) {
          console.log(backData)

          let res = template('categoryTemp', backData)
          $('tbody').html(res)
        }
      }
    })
  }
  updateData()
  $('#myModal').on('show.bs.modal', function (e) {
    if (e.relatedTarget === $('#xinzengfenlei')[0]) {
      // 判断以上事件源 后面的事件源必须是dom元素 如果是JQ元素的话就要利用下标来进行转换
      $(this)
        .find('#myModalLabel')
        .text('新增分类')
      $(this)
        .find('#btnAddOrEdit')
        .text('新增')
        .addClass('btn-primary')
        .removeClass('btn-success')
    } else {
      $(this)
        .find('#myModalLabel')
        .text('编辑分类')
      $(this)
        .find('#btnAddOrEdit')
        .text('编辑')
        .addClass('btn-success')
        .removeClass('btn-primary')
      $('#recipient-name').val(
        $(e.relatedTarget)
          .parent()
          .prev()
          .prev()
          .text()
          .trim()
      )
      $('#message-text').val(
        $(e.relatedTarget)
          .parent()
          .prev()
          .text()
          .trim()
      )
      $('#category-id').val($(e.relatedTarget).attr('data-id'))
    }
  })
  $('#btnAddOrEdit').on('click', function () {
    if ($(this).hasClass('btn-primary')) {
      let name = $('#recipient-name')
        .val()
        .trim()
      let slug = $('#message-text')
        .val()
        .trim()
      $.ajax({
        type: 'post',
        url: BigNew.category_add,
        data: {
          name: name,
          slug: slug
        },
        // headers: {
        //     Authorization:window.localStorage.getItem('token')
        // },
        success: function (backData) {
          if (backData.code == 201) {
            updateData()
            $('#myModal').modal('hide')
            $('#recipient-name').val('')
            $('#message-text').val('')
          }
        }
      })
    } else {
    //   let name = $('#recipient-name').val().trim()
    //   let slug = $('#message-text').val().trim()
    //   let id = $('#category-id').val().trim()
        // JQ 的 .serialize() 方法跟formdate的用法差不多，都是可以获取form表单里面具有name属性的值
        //  可以作为$.ajax 的请求参数使用，但是formdate可以获取文件，serialize不行，ps：文件例如上传图片文件的那个文件
    let data = $('form').serialize()
      $.ajax({
        type: 'post',
        url: BigNew.category_edit,
        // data: {
        //   id: id,
        //   name: name,
        //   slug: slug
        // },
        data:data,
        success: function (backData) {
          if (backData.code == 200) {
            alert(backData.msg)
            updateData()
            $('#myModal').modal('hide')
            $('#recipient-name').val('')
            $('#message-text').val('')
          }
        }
      })
    }
  })
    // 删除文章类别
    $('tbody').on('click','.btn-delete', function () {
        if (confirm('确定要删除吗')) {
            let id = $(this).attr('data-id')
        console.log('11111');
        
        
        $.ajax({
            type: 'post',
            url: BigNew.category_delete,
            data: {
                id:id
            },
            success: function (backData) {
                if (backData.code == 204) {
                    alert('删除成功')
                    updateData() 
                }
                
            }
    })
      }
    })
    // 每次点击取消模态框里的form表单
    
    
})
